<template>
	<view class="container">
		<uni-forms ref="form">
			<uni-forms-item label="选择车辆" labelWidth="75px" required>
				<uni-data-select>

				</uni-data-select>
			</uni-forms-item>
			<uni-forms-item label="用车部门" labelWidth="75px" required>
				<uni-easyinput placeholder="请输入用车部门"></uni-easyinput>
			</uni-forms-item>
			<uni-forms-item label="出车时间" labelWidth="75px" required>
				<uni-datetime-picker format="YYYY-MM-DD HH:mm" placeholder="请选择出车时间" type="datetime"
					@confirm="handleDepartureTimeConfirm"></uni-datetime-picker>
			</uni-forms-item>
			<uni-forms-item label="回车时间" labelWidth="75px" required>
				<uni-datetime-picker format="YYYY-MM-DD HH:mm" placeholder="请选择回车时间" type="datetime"
					@confirm="handleReturnTimeConfirm"></uni-datetime-picker>
			</uni-forms-item>
			<uni-forms-item label="出发地点" labelWidth="75px" required>
				<uni-easyinput placeholder="请输入出发地点"></uni-easyinput>
			</uni-forms-item>
			<uni-forms-item label="回车地点" labelWidth="75px" required>
				<uni-easyinput placeholder="请输入回车地点"></uni-easyinput>
			</uni-forms-item>
			<uni-forms-item label="用车事由" labelWidth="75px" required>
				<textarea maxlength="-1" style="background-color: white;" />
			</uni-forms-item>
		</uni-forms>
		<button type="primary" @click="submit">提交</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {
			handleDepartureTimeConfirm(value) {
				console.log('出车时间确认:', value);
			},
			handleReturnTimeConfirm(value) {
				console.log('回车时间确认:', value);
			},
			submit(ref) {
				this.$modal.showToast('模块建设中~')
			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: #f5f6f7;
	}

	.container {
		padding: 30rpx;
	}

	.uni-forms-item {
		margin-bottom: 30rpx;
		// background-color: antiquewhite;
	}

	textarea {
		width: 530rpx;
	}

	button {

		width: 50vw;
		margin: 130rpx auto;
		background: rgb(22, 155, 213);
	}
</style>